import React from 'react';
import { Link } from 'react-router-dom';
import {
  FormOutlined,
  DeleteOutlined,
} from '@ant-design/icons';

// import { config } from '~/config/config';
const timestampToTime = (timestamp: any) => {
  const date = new Date(timestamp);// 时间戳为10位需*1000，时间戳为13位的话不需乘1000
  const Y = `${date.getFullYear()}/`;
  const M = `${date.getMonth() + 1 < 10 ? `0${date.getMonth() + 1}` : date.getMonth() + 1}/`;
  const D = `${date.getDate()} `;
  return Y + M + D;
};

const getColumns = (props: any) => {
  const columns = [
    {
      title: 'Experience name',
      dataIndex: 'expName',
      key: 'expName',
      width: '25%',
      render: (_text: string, row: any) => (
        <Link to={`/experience/detail?id=${row.id as string}`} className="avatar-wrap">
          <div className="flex flex-col">
            <div>{row.expName}</div>
          </div>
        </Link>
      ),
    },
    {
      title: 'Country/Region',
      dataIndex: 'countryName',
      key: 'countryName',
      width: '15%',
      render: (_text: string, row: any) => (
        <div className="flex flex-col">
          <div>{row.countryName}</div>
        </div>
      ),
    },
    {
      title: 'Industry',
      dataIndex: 'industryName',
      key: 'industryName',
      width: '15%',
    },
    {
      title: 'author',
      key: 'author',
      dataIndex: 'author',
      width: '15%',
      render: (_text: any, row: any) => (
        <div className="flex flex-col">
          <div>{row.author}</div>
        </div>
      ),
    },
    {
      title: 'Publish time',
      key: 'createTime',
      width: '15%',
      render: (_text: any, row: any) => (
        <div className="flex flex-col">
          <div>{timestampToTime(row.createTime)}</div>
        </div>
      ),
    },
    {
      title: 'Actions',
      key: 'action',
      width: '10%',
      render: (_text: any, row: any) => (
        <span>
          <Link to={`/experience/edit?id=${row.id as string}`}
            className="cursor-pointer text-gray-500 mr-4"
          >
            <FormOutlined />
          </Link>

          <span
            className="cursor-pointer text-gray-500"
            onClick={() => props.deleteItem(row.id)}
          >
            <DeleteOutlined />
          </span>
        </span>
      ),
    },
  ];

  return columns;
};

export { getColumns };
